/**
 * Created by zzy on 2017/5/18.
 */

import React, {Component} from 'react';
import {
    View,
    WebView,
    Dimensions,
    ScrollView,
    Image
} from 'react-native';
import {observer} from 'mobx-react/native'
import {observable, action, computed} from 'mobx'

var screenWidth= Dimensions.get('window').width;
@observer
export  default class TicketPage extends Component{
    @observable mathPics=[];
    constructor(props) {
        super(props);
        // 初始状态
        this.pictures=this.props.productDetailPictures;
    }
    render() {
        return <View style={{flex: 1,backgroundColor: 'white'}}>
        <ScrollView>

            {
                 this.mathPics.length==this.pictures.length?this.mathPics:(null)
            }
        </ScrollView>
        </View>
    }
    componentWillMount(){
        this.detailPictures();
    }
    componentDidMount(){
    }
    detailPictures(){
        for(var j=0;j<this.pictures.length;j++){
            let pics=[];
            let uri=this.pictures[j];
            Image.getSize(uri, (width, height) => {
                height = screenWidth * height / width; //按照屏幕宽度进行等比缩放
                this.mathPics.push(<Image key={parseInt(100*Math.random())} style={{width:screenWidth,height:height}} source={{uri:uri}}></Image>)
            });
        }
    }
}